構成
この構成は、チャートの動作を変更するために使用されます。スタイル、フォント、凡例などを制御するプロパティがあります。
グローバル構成
この概念は、構成を維持するために Chart.js 1.0 で導入されました。ドライ、グラフの種類全体でオプションをグローバルに変更できるため、インスタンスごとにオプションを指定したり、特定のグラフの種類のデフォルトを指定したりする必要がなくなります。
Chart.js は、チャート タイプのデフォルトを使用して、チャートに渡されたオプション オブジェクトをグローバル設定とマージし、デフォルトを適切にスケールします。こうすることで、該当するすべてのチャート タイプのデフォルトを変更しながら、個々のチャート構成を必要に応じて具体的にすることができます。グローバルな一般オプションは次のように定義されています。Chart.defaults.global
。各グラフ タイプのデフォルトについては、そのグラフ タイプのドキュメントで説明されています。
次の例では、チャート タイプのデフォルトまたは作成時にコンストラクターに渡されるオプションによってオーバーライドされなかったすべてのチャートに対して、ホバー モードを「最も近い」に設定します。
Chart.defaults.global.hover.mode = 'nearest';
// Hover mode is set to nearest because it was not overridden here
var chartHoverModeNearest = new Chart(ctx, {
type: 'line',
data: data
});
// This chart would have the hover mode that was passed in
var chartDifferentHoverMode = new Chart(ctx, {
type: 'line',
data: data,
options: {
hover: {
// Overrides the global setting
mode: 'index'
}
}
});
データセットの構成
オプションはデータセット上で直接構成できます。データセット オプションは 3 つの異なるレベルで変更でき、次の優先順位で評価されます。
- データセットごと: データセット。*
- チャートごと: options.datasets[type].*
- またはグローバル: Chart.defaults.global.datasets[type].*
ここで、 type はデータセットのタイプに対応します。
ノート:データセット オプションは要素オプションよりも優先されます。
次の例では、showLine
作成時にデータセットに渡されるオプションによってオーバーライドされるものを除く、すべてのライン データセットのオプションを「false」に設定します。
// Do not show lines for all datasets by default
Chart.defaults.global.datasets.line.showLine = false;
// This chart would show a line only for the third dataset
var chart = new Chart(ctx, {
type: 'line',
data: {
datasets: [{
data: [0, 0],
}, {
data: [0, 1]
}, {
data: [1, 0],
showLine: true // overrides the `line` dataset default
}, {
type: 'scatter', // 'line' dataset default does not affect this dataset since it's a 'scatter'
data: [1, 1]
}]
}
});